Setting group - Slideshow control settings - Slideshow with text controls

The Slideshow with text controls settings group allows users to customize the appearance and behavior of slideshows across the site. These settings include options for animation styles, speeds, autoplay features, and navigation controls, ensuring a consistent and engaging visual experience.

Key components include the ability to choose between default and fade animation styles, set animation speed and autoplay delay, and enable or disable autoplay. Users can also position controls horizontally and select from various pagination styles, such as dynamic, fraction, progress bar, and scrollbar.

Display settings allow for the customization of navigation and pagination visibility, as well as the option to show previews of upcoming slides. These features provide flexibility in designing slideshows that align with the shop's aesthetic and functional goals.

Usage examples include creating a dynamic homepage slideshow with a moderate autoplay delay, highlighting seasonal collections with a fade animation style, and designing interactive product galleries with right-positioned controls and a progress bar pagination style. These settings enhance user engagement and visual appeal throughout the shop.

Overview

The Slideshow with text controls settings group is designed to manage the appearance and behavior of slideshows across the entire site. These settings allow users to customize animation styles, speeds, autoplay features, and navigation options, ensuring a consistent and engaging visual experience throughout the shop.

Key components and functionality

Slideshow settings

This section provides control over the slideshow's animation and playback features, allowing for a tailored visual presentation.

Animation style

This setting determines the visual transition effect between slides in the slideshow.

• Options: Default, Fade
  • Default: Provides a standard transition effect.
  • Fade: Creates a smooth fade transition between slides, which forces a single slide layout.

Animation speed

Controls how quickly the slideshow transitions from one slide to the next.

• Range: 0.1 to 5 seconds
• Default: 0.8 seconds

Autoplay delay

Sets the delay between slides when autoplay is enabled.

• Range: 0 to 10 seconds
• Default: 4 seconds

Autoplay slideshow

Enables or disables the automatic progression of slides.

• Default: False

Control settings

These settings manage the positioning and style of slideshow controls, enhancing user interaction.

Controls position horizontal

Determines the horizontal placement of slideshow controls.

• Options: Left, Right
  • Left: Positions controls on the left side.
  • Right: Positions controls on the right side.
• Default: Left

Pagination style

Defines the style of pagination indicators used in the slideshow.

• Options: Dynamic, Fraction, Progress bar, Scrollbar
  • Dynamic: Adapts to the number of slides.
  • Fraction: Displays the current slide number over the total number of slides.
  • Progress bar: Shows a progress bar indicating the slideshow's progression.
  • Scrollbar: Provides a scrollbar for navigation.

Display settings

These settings control the visibility of navigation and pagination elements, allowing for a customized user interface.

Show navigation

Enables the display of navigation controls for the slideshow.

• Default: True

Show pagination

Controls the visibility of pagination indicators.

Show preview of next slides

Allows a preview of the next slides to be visible, enhancing the user's ability to anticipate upcoming content.

• Default: True

Usage examples

1. Creating a dynamic homepage slideshow: You might consider using the default animation style with a moderate autoplay delay to create a visually engaging slideshow that automatically cycles through featured products or promotions.

2. Highlighting seasonal collections: Consider enabling the fade animation style for a smooth transition effect, which can be ideal for showcasing seasonal collections with a more elegant presentation.

3. Interactive product galleries: Position controls on the right and use a progress bar pagination style to create an interactive product gallery that users can easily navigate.

These settings provide flexibility in designing slideshows that align with the overall aesthetic and functional goals of the shop, enhancing user engagement and visual appeal.